<template>
<div></div>
</template>

<script setup>
import * as THREE from 'three';

//创建场景
const scene = new THREE.Scene();
//创建相机
const camera = new THREE.PerspectiveCamera();
camera.position.y = 5
camera.position.z = 10


//创建立方体
const geometry = new THREE.BoxGeometry(1,1,1);
const material = new THREE.MeshBasicMaterial({color:0x00ff00});

//网格
const cube = new THREE.Mesh(geometry,material);
cube.position.set(0,3,0)
scene.add(cube);

//添加网格地面
const gridHelper = new THREE.GridHelper(10,10);
scene.add(gridHelper);

//创建渲染器
const renderer = new THREE.WebGLRenderer()
document.body.appendChild(renderer.domElement)
//调整渲染器窗口大小
renderer.setSize(window.innerWidth,window.innerHeight)
renderer.render(scene,camera);


</script>

<style>


</style>
